<!DOCTYPE html>
<!--[if IE 8]> <html lang="zh-CN" class="ie8 no-js"><![endif]-->
<!--[if IE 9]> <html lang="zh-CN"> <![endif]-->
<!--[if !IE]> <html lang="zh-CN"> <![endif]-->
<head>
    <title>人员选择-人员选择</title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta content="width=device-width, initial-scale=1" name="viewport" />
    <meta content="" name="description" />
    <meta content="" name="author" />
    <link rel="shortcut icon" href="/wui/favicon.png" />
    <!-- Date -->
    <link rel="stylesheet" type="text/css" href="/wui/dist/plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.css"/> 
    <!-- Grid -->
    <link rel="stylesheet" type="text/css" href="/wui/dist/plugins/jqGrid_JS_5.1.1/css/ui.jqgrid-bootstrap.css" /> 
    <!-- Tree -->
    <link rel="stylesheet" type="text/css" href="/wui/dist/plugins/fancytree/themes/skin-xp/ui.fancytree.css" />
    <link rel="stylesheet" type="text/css" href="/wui/dist/plugins/jquery-contextMenu/jquery.contextMenu.css" /> 
    <!-- 框架布局样式 -->
    <link rel="stylesheet"  charset="utf-8" type="text/css" href="/wui/dist/themes/layout/wui.min.css"/>
    <!-- 框架皮肤样式 -->
    <link id="wuiSkin" rel="stylesheet" type="text/css" href="/wui/dist/themes/default/style.css"/>
    <!-- 工作流表单样式 -->
    <link rel="stylesheet"  charset="utf-8" type="text/css" href="/wui/dist/expands/css/style.css"/>
    <link rel="stylesheet" type="text/css" href="/dist/plugins/jquery-contextMenu/jquery.contextMenu.css" />
    <!-- 脚本 -->
    <!--[if lt IE 9]>
        <script src="/wui/dist/plugins/html5shiv.min.js"></script>
        <script src="/wui/dist/plugins/respond.min.js"></script>
        <script src="/wui/dist/plugins/excanvas.min.js"></script> 
        <script src="/wui/dist/plugins/placeholder.js"></script> 
    	<script src="/wui/dist/plugins/es5-shim.min.js"></script>
    	<script src="/wui/dist/plugins/es5-sham.min.js"></script>
    	<script src="/wui/dist/plugins/json3.min.js"></script>
    <![endif]-->

    <script src="/wui/dist/plugins/jquery.min.js" type="text/javascript"></script>
</head>
<body class="popup-page">
    <div class="popup-page-body">
        <!-- 选项卡模块 -->
        <div class="popup-page-tab">
            <div class="tab-concise popup-tab-container" id="selectTabs">
                <ul class="nav nav-tabs" wui-tabs-part="nav" style="width: 100%">
                    <li role="presentation"><a href="#commonUsers" aria-controls="home" role="tab" data-toggle="tab">常用</a></li>
                    <li role="presentation"><a href="#customGroup" aria-controls="profile" role="tab" data-toggle="tab">自定义组</a></li>
                    <li role="presentation"><a href="#all" aria-controls="profile" role="tab" data-toggle="tab">全部</a></li>
                </ul>
                <div class="tab-content tab-overflow" wui-tabs-part="tabContent">
                    <div role="tabpanel" class="tab-pane fade" id="commonUsers" style="overflow: auto;">
                        <div class="wui-checkbox" id="commonUsersList">
                        </div>
                    </div>
                    <div role="tabpanel" class="tab-pane fade" id="customGroup">
                        <ul class="wui-items user-items" id="customGroupList" style="overflow: auto;">
                        </ul>
                    </div> 
                    <div role="tabpanel" class="tab-pane fade" id="all">
                        <div class="main-module">
                            <!-- 树模块 -->
                            <div class="module-tree">
                                <div class="tree-head">
                                    <h4>
                                        <span id="treeTitle">组织选择</span>
                                        <div class="wui-form-check">
                                            <input type="checkbox" name="cnLowerLevel" value="1" />
                                            <label for="cnLowerLevel" class="fa">
                                            </label>
                                            <span>包含下级</span>
                                        </div>
                                    </h4>
                                </div>
                                <div class="tree-content">
                                    <div id="orgsTree"></div>
                                </div>
                            </div>
                            <!-- 列表模块 -->
                            <div class="module-list">
                                <table id="userList"></table>
                            </div>
                        </div>
                    </div>                                     
                </div>
            </div>
        </div>
        <!-- 选中节点集 -->
        <div class="popup-page-items">
            <input type="text" id="chosen" />
        </div>
    </div>
    <div class="popup-page-footer">
        <div class="footer-actions">
            <button type="button" class="wui-btn wui-btn-primary" id="btnSubmit">保存</button>
            <button type="button" class="wui-btn wui-btn-default" id="btnCancel">取消</button>
        </div>
    </div>

    <!-- 常用联系人模板 -->
    <script id="commonUsersListTemplate" type="text/html">
        {{each users}}
            <div class="wui-form-check">
                <input type="checkbox" name="{{$value.loginId}}" value="{{$value.userName}}" />
                <label for="{{$value.loginId}}" class="fa"></label>
                <span>{{$value.userText}}</span>
                <button type="button" _id="{{$value.loginId}}" _action="delCommonUse" class="wui-btn wui-btn-link wui-text-danger cancel-common-use-btn">删除</button>
            </div>
        {{/each}}
    </script> 
    
    <!-- 自定义组模板 -->
    <script id="customGroupListTemplate" type="text/html">
        {{each groups}}
            <li>
                <a href="javascript:void(0);" _data="{{$value.groupName}}">{{$index+1}}、{{$value.groupText}}</a>
            </li>
        {{/each}}
    </script> 

    <!-- 第三方插件 -->
    <script type="text/javascript" src="/wui/dist/wui.plugins.min.js"></script>

    <!-- Date -->
    <script src="/wui/dist/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js" type="text/javascript"></script>


    <!-- Grid -->
    <script src="/wui/dist/plugins/jqGrid_JS_5.1.1/js/jquery.jqGrid.js" type="text/javascript"></script>

    <!-- Tree -->
    <script src="/wui/dist/plugins/fancytree/jquery.fancytree.js" type="text/javascript"></script>

    <!-- 框架完整配置文件:加载在组件前面 -->
    <script src="/wui/dist/wui.config.js" type="text/javascript"></script>
    <!-- 框架语言包(按需引入且必须加载在组件前面) -->
    
    <!-- WUI组件脚本 -->
    <script src="/wui/dist/wui.min.js" type="text/javascript"></script>
    <!-- 自定义校验规则 -->
    
    
    <!-- 加载全局模拟数据:实际开发不需要这个 -->
    <script src="/examples/js/Global.js" type="text/javascript"></script>
    <!-- 服务类 -->
    <script src="js/service/popupService.js" type="text/javascript"></script>
    <!-- 脚本控制 -->
    <script src="js/controller/userChooseBoxPopupController.nn.js" type="text/javascript"></script>
    
    <script type="text/javascript">
        
        $(document).ready(function() {
            // 初始化页面
            initPage();
        });
    </script>
</body>
</html>